<route lang="json5" type="page">
{
  layout: 'default',
  style: {
    navigationBarTitleText: '商品列表',
  },
}
</route>

<template>
  <view class="min-h-screen py-4 bg-[#f1f1f1]">
    <view class="flex justify-end mb-4 px-4">
      <wd-button type="primary" custom-class="m-0" @click="addProduct">新增商品</wd-button>
    </view>
    <!-- 产品列表 -->

    <wd-card v-for="item in list" :key="item.id" :title="item.name">
      <wd-cell-group>
        <wd-cell title="图片">
          <image class="w-12 h-12" :src="item.image"></image>
        </wd-cell>
        <wd-cell title="产品原价" :value="`￥${item.price}`"></wd-cell>
        <wd-cell title="产品价格" :value="`￥${item.vipPrice}`"></wd-cell>
        <wd-cell title="是否拼团" :value="item.isSpell == 1 ? '否' : '是'"></wd-cell>
        <wd-cell
          title="产品拼团价"
          v-if="item.isSpell == 2"
          :value="`￥${item.spellPrice}`"
        ></wd-cell>
      </wd-cell-group>
      <template #footer>
        <wd-button size="small" plain @click="edit(item)">编辑</wd-button>
      </template>
    </wd-card>
  </view>
</template>

<script setup>
import { http } from '@/utils/http'

const list = ref([])

const storeId = ref('')

const getList = async () => {
  let res = await http.get('/api/home/products', { storeId: storeId.value })
  if (res.code == 200) {
    list.value = res.data.products
  }
}

const addProduct = () => {
  uni.navigateTo({ url: `/pages/store/productEdit?mode=add` })
}

const edit = (item) => {
  uni.navigateTo({ url: `/pages/store/productEdit?id=${item.id}&mode=edit` })
}

onLoad(async (option) => {
  storeId.value = option.storeId
  getList()
})
</script>

<style lang="scss" scoped>
//
</style>
